// 权限有关都在这里
// console.log('权限管理开始')

import router from '@/router'
import store from '@/store'

import { asyncRoutes } from '@/router'

// 声明白名单
const whiteList = ['/login', '/404']

router.beforeEach(async(to, from, next) => {
  const token = store.getters.token
  if (token) {
    // 有token
    if (to.path === '/login') {
      // 登录页
      // 重定向
      next('/')
    } else {
      // 跳转到任何一个除了登陆的页面
      if (!store.getters.userId) {
        // 个人权限数据  -->  拿到当前用户可访问的所有菜单标识
        const res = await store.dispatch('user/asyncSetUserInfo')
        // console.log('接收action函数返回值', res)

        /**
         * 权限应用--控制动态路由
         * 1.明确->权限控制发生在pemission.js文件中
         * 2.拿到当前用户可访问的所有菜单标识
         * 3.拿到本地所有的动态路由列表
         * 4.两份数据配合做过滤处理得到当前用户所有可以访问的动态路由表、
         * 5.将路由表添加到路由系统中，让路由可被访问
         *   使用addRoutes方法添加动态路由
         * 6.将路由表添加到菜单里显示到左侧
         * */
        // 1.拿到两份数据
        // 个人权限数据  -->  拿到当前用户可访问的所有菜单标识
        const roles = res.roles
        console.log('个人权限数据', roles)
        // 菜单数据
        const menus = res.roles.menus
        console.log('菜单数据', menus)
        // 所有的动态路由表
        console.log('所有的动态路由', asyncRoutes)
        // 做过滤处理
        // 过滤思路：遍历我们所有的动态路由表   如果路由的name属性能在menus权限数据中找到代表可以访问
        let filterRoutes = []
        filterRoutes = asyncRoutes.filter((route) => {
          return menus.includes(route.children[0].name)
        })
        console.log('过滤后', filterRoutes)

        // 实际应用：
        // 2.显示到左侧菜单中
        // 把动态路由数据交给菜单
        store.commit('menus/setMenuList', [...filterRoutes, { path: '*', redirect: '/404', hidden: true }])
        // 1.把动态路由添加到应用的路由系统里
        router.addRoutes([...filterRoutes, { path: '*', redirect: '/404', hidden: true }])
        // 解决刷新出现的白屏现象
        next({
          ...to, // next({ ...to })的目的,是保证路由添加完了再进入页面 (可以理解为重进一次)
          replace: true // 重进一次, 不保留重复历史
        })
        return
      }
      next()
    }
  } else {
    // 没token
    if (whiteList.includes(to.path)) {
      // 在白名单上
      next()
    } else {
      // 不在白名单
      next('/login')
    }
  }
})
